<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>游戏系统 - 首页</title>
    <!-- Bootstrap CSS 链接 -->
    <link rel="stylesheet" href="./common/css/bootstrap.min.css">
    <link rel="stylesheet" href="./common/css/index.css">

    <style>
        .card-text.description {
            display: -webkit-box;
            -webkit-line-clamp: 3;
            /* 显示行数 */
            -webkit-box-orient: vertical;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        /* 在你的 CSS 文件中添加以下代码 */
        .btn-custom {
            background-color: #28a745;
            /* 设置按钮背景颜色 */
            color: #fff;
            /* 设置文字颜色 */
            border-color: #28a745;
            /* 设置边框颜色 */
        }

        .btn-custom:hover {
            background-color: #218838;
            /* 鼠标悬停时的背景颜色 */
            border-color: #218838;
            /* 鼠标悬停时的边框颜色 */
        }

        /* 添加阴影和鼠标移动效果 */
        .card-hover {
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            transition: transform 0.2s ease-in-out;
        }

        .card-hover:hover {
            transform: translateY(-2px);
        }

        a {
            text-decoration: none !important;
            /* 使用 !important 提高优先级 */
            color: inherit !important;
            /* 使用 !important 提高优先级 */
        }
    </style>
</head> 

<?php
// 引入数据库连接代码
include 'conn.php';
include 'header.php';
include 'function.php';

// 处理搜索请求的函数
function searchGames($conn, $search_keyword)
{
    // 查询包含搜索关键词的游戏信息
    $sql = "SELECT * FROM games WHERE title LIKE '%$search_keyword%'";
    $result = executeQuery($conn, $sql);

    if ($result && mysqli_num_rows($result) > 0) {
        echo '<div class="container mt-4">';
        echo '<h2>搜索结果</h2>';

        while ($row = mysqli_fetch_assoc($result)) {
            $game_id = $row['game_id'];
            $title = $row['title'];
            $description = $row['description'];
            $rating = $row['rating'];
            $image_path = $row['image_path'];

            // 仅在有搜索结果时显示标题
            echo '<div class="row mt-4">';

            // 以下为卡片显示的代码，修改 col-md-3 为 col-md-3 col-6
            echo '<div class="col-md-3 mb-4">';
            echo '<a href="games_details.php?game_id=' . $game_id . '">';
            echo '<div class="card h-100 card-hover">';
            echo '<img src="' . $image_path . '" class="card-img-top" alt="' . $title . '" style="width: 100%; height: 200px;">';
            echo '<div class="card-body">';
            echo '<h5 class="card-title">' . $title . '</h5>';
            echo '<p class="card-text description">' . $description . '</p>';
            echo '<p class="card-text"><small class="text-muted">评分: ' . $rating . '</small></p>';
            echo '</div>';
            echo '</div>';
            echo '</a>';
            echo '</div>';

            echo '</div>';
        }

        echo '</div>';
        mysqli_free_result($result);
    } else {
        echo '<div class="container mt-4">';
        echo '<h2>未找到与"' . $search_keyword . '"相关的游戏</h2>';
        echo '</div>';
    }
}

// 处理搜索请求
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    // 获取搜索关键词
    $search_keyword = mysqli_real_escape_string($conn, $_POST['search']);

    // 调用搜索函数
    searchGames($conn, $search_keyword);

    // 关闭数据库连接
    closeConnection($conn);
}
?>




</body>

</html>